﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true" CodeBehind="DropDown.aspx.cs" Inherits="Samples.Views.Samples.DropDown" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <div class="demoarea">
        <div class="demoheading">DropDown</div>
                
        <div>Hover over the text below and click to select an option:</div>
        <br />
        <span id="TextLabel" style="display: block; width: 300px; padding: 2px; padding-right: 50px; font-family: Tahoma; font-size: 11px;">Select your favorite exotic ice-cream flavor</span>
        <div id="DropPanel" class="ContextMenuPanel" style="display: none; visibility: hidden;">
            <a id="Option1" class="ContextMenuItem" href="javascript:selectItem('Mocha Blast');">Mocha Blast</a>
            <a id="Option2" class="ContextMenuItem" href="javascript:selectItem('Java Cyclone');">Java Cyclone</a>
            <a id="Option3" class="ContextMenuItem" href="javascript:selectItem('Dry Fruit');">Dry Fruit</a>
        </div>
        <br />
        
        <div><span id="lblSelection" style="padding: 5px;"></span></div>
    </div>
    
    <script type="text/javascript" language="javascript">
        //<![CDATA[
        function selectItem(strItem) {
            $get('lblSelection').innerHTML = "You selected <strong>"+ strItem +"</strong>.";
        }
        //]]>
    </script>
    
    <%= Ajax.DropDown("TextLabel", "DropPanel") %>
</asp:Content>